import React, {
    forwardRef,
    useState,
    useImperativeHandle,
    ChangeEvent,
    useRef,
    useEffect,
} from "react";
import {
    Button,
    Modal,
    Input,
    Table,
    Space,
    Form,
    Pagination,
    Select,
    Radio,
    Image,
    Upload,
    DatePicker,
    Divider,
    DatePickerProps,
    TreeSelect,
    Switch,
} from "antd";
import {
    FontSizeOutlined,
    PayCircleOutlined,
    BankOutlined,
    DesktopOutlined,
    ExclamationCircleOutlined,
} from "@ant-design/icons";
import type { TabsProps } from "antd";
import {
    commonErrorMsg,
    deepClone,
    deepCopy,
    defaultProjectSubTableList,
    formatTime,
    formatYear,
    getChangeEventValue,
    handleJumpEditPage,
    isEmpty,
    provinceList,
    toastShort,
} from "../../../utils";
import systemApi from "../../../api/system";
import {
    DocInstance,
    ProtectlandBaseInfoType,
    ProtectlandExtraInfoType,
    ProtectlandType,
    SearchSelectResult,
    SelectOption,
    TopicTemplateType,
    TopicType,
} from "../../../utils/types";
import ProtectlandDetailsModal from "./ProtectlandDetailsModal";
import { Link, useLocation, useNavigate, useSearchParams } from "react-router-dom";
import LoadingWapper from "../../../components/loading/LoadingWapper";
import { protectlandNameList } from "../../../utils/data";
import SearchSelect from "../../../components/select/SearchSelect";

interface Props {
    onFinish?: Function;
}

const { TextArea, Search } = Input;
const { RangePicker } = DatePicker;
const { Option } = Select;

const CopyProjectModal = (props: Props, ref: any) => {
    useImperativeHandle(ref, () => ({
        openModal: openModal,
    }));

    const { onFinish } = props;
    const startYearOptions = [
        {
            value: '2000',
            label: '2000',
        },
        {
            value: '2001',
            label: '2001',
        },
        {
            value: '2002',
            label: '2002',
        },
        {
            value: '2003',
            label: '2003',
        },
        {
            value: '2004',
            label: '2004',
        },
        {
            value: '2005',
            label: '2005',
        },
        {
            value: '2006',
            label: '2006',
        },
        {
            value: '2007',
            label: '2007',
        },
        {
            value: '2008',
            label: '2008',
        },
        {
            value: '2009',
            label: '2009',
        },
        {
            value: '2010',
            label: '2010',
        },
        {
            value: '2011',
            label: '2011',
        },
        {
            value: '2012',
            label: '2012',
        },
        {
            value: '2013',
            label: '2013',
        }, {
            value: '2014',
            label: '2014',
        },
        {
            value: '2015',
            label: '2015',
        },
        {
            value: '2016',
            label: '2016',
        },
        {
            value: '2017',
            label: '2017',
        },
        {
            value: '2018',
            label: '2018',
        },
        {
            value: '2019',
            label: '2019',
        },
        {
            value: '2020',
            label: '2020',
        },
        {
            value: '2021',
            label: '2021',
        },
        {
            value: '2022',
            label: '2022',
        },
        {
            value: '2023',
            label: '2023',
        },
        {
            value: '2024',
            label: '2024',
        },
    ]
    const navigate = useNavigate();
    const routerLocation = useLocation();
    const [searchParams, setSearchParams] = useSearchParams();
    const [isModalOpen, setIsModalOpen] = useState(false);
    const [form] = Form.useForm<ProtectlandBaseInfoType>();
    const [formData, setFormData] = useState<ProtectlandBaseInfoType>({});
    const protectlandDetailsModalRef = useRef<any>(null);
    const [defaultFormData] = useState<ProtectlandBaseInfoType>({
        id: "",
        type: null,
        subType: null,
        protectlandLevel: null,
        protectlandProvince: null,
        //@ts-ignore
        protectlandName: [],
        protectlandArea: "",
        protectlandTypeId: "",
        protectlandAreaUnit: "",
        startYear: "",
        endYear: "",
        protectlandProblemList: "",
        yearRange: [],
        topicTemplateId: "",
        endYearStep: "",
        protectlandExtraInfo: {
            //@ts-ignore
            projectSubTableList: [...defaultProjectSubTableList],
            supplementaryInformation: {
                geographicalLocationText: "",
                rangeText: "",
                historicalEvolutionText: "",
                legalStatusText: "",
                mainProtectionObjecText: "",
                administrativeDivisionText: "",
                landOwnershipText: "",
                geologyAndGeomorphologyText: "",
                climateText: "",
                hydrologyText: "",
                soilText: "",
                vegetationText: "",
                fungusText: "",
                landscapeResourcesText: "",
                naturalDisasterText: "",
            },
            protectedNaturalEnvironment: {
                geographicalLocationText: "",
                climateText: ""
            }
        }
    });
    const [searchValue, setSearchValue] = useState("");

    const [submitLoading, setSubmitLoading] = useState(false);
    const [currentRowData, setCurrentRowData] = useState<ProtectlandBaseInfoType>(
        {}
    );
    const [getDataLoading, setGetDataLoading] = useState(true);
    //部门数据
    const [protectlandTypeList, setProtectlandTypeList] = useState<
        Array<ProtectlandType>
    >([]);
    const [currentProtectlandSubTypeList, setCurrentProtectlandSubTypeList] =
        useState<ProtectlandType[]>();
    const [loading, setLoading] = useState(false);
    const [endYearOptions, setEndYearOptions] = useState<SelectOption[]>([]);
    const [isCopy, setIsCopy] = useState<boolean>(false);
    const [getTopicTemplateLoading, setGetTopicTemplateLoading] =
        useState<boolean>(false);
    const [topicTemplateOptions, setTopicTemplateOptions] = useState<
        SelectOption[]
    >([]);

    const [currentTypeProtectLandList, setCurrentTypeProtectLandList] = useState<
        SelectOption[]
    >([]);

    const oldDocInstanceTopicList = useRef<TopicType[]>([]);

    useEffect(() => {
        let tempEndYearOptions: SelectOption[] = [];
        for (let i = 0; i < 50; i++) {
            tempEndYearOptions.push({
                label: `${i + 1}年`,
                value: `${i + 1}`,
            });
        }
        setEndYearOptions(tempEndYearOptions);
        let protectlandTypeProtectLandOptions = [];
        protectlandNameList.forEach((ele) => {
            ele.children.forEach((ele) => {
                protectlandTypeProtectLandOptions.push({
                    label: ele.name,
                    value: ele.name,
                });
            });
        });
        setCurrentTypeProtectLandList([...protectlandTypeProtectLandOptions]);
    }, []);

    const openModal = (rowData: DocInstance, isCopyMode?: boolean) => {
        const { search, pathname } = routerLocation;
        if (isCopyMode) {
            setIsCopy(isCopyMode);
        }
        setIsModalOpen(true);
        let params = {
            id: rowData.id
        }
        systemApi.getProjectBaseInfo(params)
            .then(res => {
                //@ts-ignore
                let topicList: TopicType[] = res.data.topicList;
                topicList.forEach(topic => {
                    delete topic.wordParagraphList;
                })
                oldDocInstanceTopicList.current = topicList;
            })
            .catch(err => {

            })
        const { keys, values } = Object;
        if (!isEmpty(rowData)) {
            rowData = deepCopy(rowData);

            const { protectlandBaseInfo } = rowData;
            const { type, subType, startYear, endYear } = protectlandBaseInfo;
            protectlandBaseInfo.yearRange = [];
            let _formData = deepCopy(protectlandBaseInfo);
            _formData.protectlandExtraInfo = rowData.protectlandBaseInfo.protectlandExtraInfo
            _formData.type = type;
            _formData.subType = subType;
            const keyList = keys(_formData);
            const valueList = values(_formData);
            _formData.endYearStep = (
                Number(formatYear(_formData.endYear)) -
                Number(formatYear(_formData.startYear)) +
                1
            ).toString();
            keyList.forEach((key, index) => {
                if (key == "startYear") {
                    form.setFieldValue(key, formatYear(valueList[index]));
                } else if (key == "endYear") {
                    form.setFieldValue("endYearStep", _formData.endYearStep);
                } else if (key == 'type' || key == 'subType') {

                } else {
                    form.setFieldValue(key, valueList[index]);
                }
            });
            setFormData({ ..._formData });
            queryProtectlandTypeList(type);
        } else {
            let _formData = deepCopy(defaultFormData);
            const keyList = keys(_formData);
            const valueList = values(_formData);
            keyList.forEach((key, index) => {
                form.setFieldValue(
                    key,
                    isEmpty(valueList[index]) ? valueList[index] : undefined
                );
            });
            setFormData(_formData);
            queryProtectlandTypeList();
        }
    };

    const queryProtectlandTypeList = (initTypeId?: string) => {
        setGetDataLoading(true);
        let params = {
            page: 1,
            size: 100,
        };
        systemApi
            .getProtectlandTypeList(params)
            .then((res) => {
                setGetDataLoading(false);
                const protectlandList: ProtectlandType[] = res.data.list;
                const treeData: ProtectlandType[] = [];
                protectlandList.forEach((ele) => {
                    let findNodeIndex = -1;
                    treeData.forEach((node, nodeIndex) => {
                        if (node.type == ele.type) {
                            findNodeIndex = nodeIndex;
                        }
                    });
                    if (findNodeIndex > -1) {
                        treeData[findNodeIndex].children.push(ele);
                    } else {
                        ele.children = [ele];
                        treeData.push(ele);
                    }
                });
                treeData.forEach((node) => {
                    node.label = node.type;
                    node.value = node.id;
                });
                if (!isEmpty(initTypeId)) {
                    const find = treeData.find((ele) => {
                        return ele.id == initTypeId;
                    });
                    if (find) {
                        const subTypeList: ProtectlandType[] = find.children;
                        let currentProtectlandSubTypeList = []
                        let _subTypeList = subTypeList.map((ele) => {
                            let option = {
                                label: ele.subType,
                                value: ele.id
                            }
                            currentProtectlandSubTypeList.push(option)
                        });
                        setCurrentProtectlandSubTypeList([...currentProtectlandSubTypeList]);
                    } else {
                        setCurrentProtectlandSubTypeList([]);
                    }
                    treeData.forEach((node) => {
                        node.label = node.type;
                        node.value = node.id;
                    });
                    setProtectlandTypeList([...treeData]);
                    setTimeout(() => {
                        if (!isEmpty(initTypeId)) {
                            form.setFieldValue('type', initTypeId)
                            form.setFieldValue('subType', initTypeId)
                        }
                    }, 200);
                } else {
                    setProtectlandTypeList([...treeData]);
                }
            })
            .catch((err) => {
            });
    };

    const handleSetFormData = (target: string, value: any) => {
        let _formData = formData;
        //@ts-ignore
        _formData[target] = value;
        setFormData(deepCopy(_formData));
    };

    const handleConfirm = async () => {
        try {
            const values = await form.validateFields();
            if (isEmpty(oldDocInstanceTopicList.current)) {
                return toastShort("error", "创建副本失败，请稍后重试")
            }
            console.log("values--->", values);
            setSubmitLoading(true);
            let params: ProtectlandBaseInfoType = formData;
            params.protectlandName = params.protectlandName[0];
            delete params.id;
            //@ts-ignore
            delete params._id;
            if (isEmpty(formData.startYear) || isEmpty(formData.endYear)) {
                return toastShort("error", "请选择规划年限");
            }
            if (isEmpty(formData.topicTemplateId)) {
                return toastShort("error", "大纲模版不能为空");
            }
            systemApi
                .addProtectlandBaseInfo(params)
                .then((res) => {
                    console.log("res---->1", res)
                    let createProjectParams: DocInstance = {
                        name: params.protectlandName + "总体规划",
                        documentType: "master",
                        hasSlaveDocument: false,
                        masterDocumentId: "",
                        protectlandTypeId: params.protectlandTypeId,
                        documentGroupId: "",
                        protectedBaseInfoId: res.data.id,
                        topicTemplateId: formData.topicTemplateId,
                        teamList: [],
                        sort: "1",
                        sectionalizationId: "6466d7c7d82ed22082e284e3",
                        status: "1",
                        topicList: oldDocInstanceTopicList.current
                    };
                    const sectionalizationId = searchParams.get("sectionalization-id");
                    if (!isEmpty(sectionalizationId)) {
                        createProjectParams.sectionalizationId = sectionalizationId;
                    }
                    systemApi
                        .addProjectByTopicList(createProjectParams)
                        .then((res) => {
                            console.log("res", res);
                            onFinish && onFinish();
                            setIsModalOpen(false);
                            handleResetModal();
                            setSubmitLoading(false);
                            const { pathname, search } = routerLocation;
                            localStorage.setItem("formEditPagePath", pathname + search);
                            // navigate('/edit?docId=' + res.data.id + '&screen=excel')
                            handleJumpEditPage(
                                "/edit?docId=" + res.data.id + "&screen=topic"
                            );
                        })
                        .catch((err) => {
                            console.log("err", err);
                            setSubmitLoading(false);
                        });
                })
                .catch((err) => {
                    console.log("err", err);
                    setSubmitLoading(false);
                });
        } catch (errorInfo) {
            console.log("Failed:", errorInfo);
        }
    };

    const handleCancel = () => {
        setIsModalOpen(false);
    };

    const handleResetModal = () => {
        setFormData(defaultFormData);
        form.resetFields();
        setSubmitLoading(false);
    };

    const onProtectlandAreaUnitChange = (e: string) => {
        handleSetFormData("protectlandAreaUnit", e);
    }

    const areaUnitListSelect = (
        <Select defaultValue="hm2" onChange={onProtectlandAreaUnitChange}>
            <Option value="hm2">公顷</Option>
            <Option value="km2">k㎡</Option>
        </Select>
    );

    const onYearRangeChange = (dateRange: any[]) => {
        console.log("onYearRangeChange---->", dateRange);
        handleSetFormData("startYear", formatYear(dateRange[0]));
        handleSetFormData("endYear", formatYear(dateRange[1]));
    };

    const onTypeChange = (value: string) => {
        const find = protectlandTypeList.find((ele) => {
            return ele.id == value;
        });
        if (find) {
            const subTypeList: ProtectlandType[] = [...find.children];
            const findCurrentTypeProtectLand = protectlandNameList.find((ele) => {
                return ele.type == find.label;
            });
            let protectlandTypeProtectLandOptions = [];
            if (findCurrentTypeProtectLand && findCurrentTypeProtectLand.children) {
                findCurrentTypeProtectLand.children.forEach((ele) => {
                    protectlandTypeProtectLandOptions.push({
                        label: ele.name,
                        value: ele.name,
                    });
                });
            }
            setCurrentTypeProtectLandList([...protectlandTypeProtectLandOptions]);
            let _subTypeList = subTypeList.map((ele) => {
                let option = {
                    label: ele.subType,
                    value: ele.id,
                };
                option = {
                    ...ele,
                    ...option,
                };
                return option;
            });
            setCurrentProtectlandSubTypeList(_subTypeList);
        } else {
            setCurrentProtectlandSubTypeList([]);
        }
        handleSetFormData("type", value);
        handleSetFormData("subType", "");
        form.setFieldValue("subType", null);
    };

    const onSubTypeChange = (value: string) => {
        console.log("value---->", value);
        handleSetFormData("protectlandTypeId", value);
        handleSetFormData("subType", value);
        // handleQueryDocTemplateList();
    };

    useEffect(() => {
        if (!isEmpty(formData.type) && !isEmpty(formData.subType)) {
            try {
                let typeStr = "";
                let subTypeStr = "";
                protectlandTypeList.forEach((ele) => {
                    if (ele.id == formData.type) {
                        typeStr = ele.type;
                    }
                });
                currentProtectlandSubTypeList.forEach((ele) => {
                    if (ele.value == formData.subType) {
                        subTypeStr = ele.label;
                    }
                });
                setGetTopicTemplateLoading(true);
                const params = {
                    subTypeStr: typeStr + subTypeStr,
                };
                // console.log("params--->", params)
                systemApi
                    .getProtectlandTypeTopicTemplateList(params)
                    .then((res) => {
                        // console.log("getProtectlandTypeTopicTemplateList--->", res);
                        let options: SelectOption[] = [];
                        if (res.data.list && res.data.list.length) {
                            res.data.list.forEach((ele) => {
                                options.push({
                                    label: ele.name,
                                    value: ele.id,
                                });
                            });
                        } else {
                            // if (isEmpty(formData.id)) {
                            //     toastShort("error", "当前保护地类型没有关联的大纲模版");
                            // }
                        }
                        setTopicTemplateOptions(options);
                        handleSetFormData("topicTemplateId", options[0].value);
                        setGetTopicTemplateLoading(false);
                    })
                    .catch((err) => {
                        setGetTopicTemplateLoading(false);
                        toastShort("error", commonErrorMsg);
                    });
            } catch (e) { }
        }
    }, [formData.type, formData.subType, currentProtectlandSubTypeList]);

    const onProvinceChange = (value: string) => {
        handleSetFormData("protectlandProvince", value);
    };

    const onProtectlandLevelChange = (value: string) => {
        handleSetFormData("protectlandLevel", value);
    };

    const handleOpenProtectlandDetaildModal = () => {
        protectlandDetailsModalRef.current.openModal(
            formData.protectlandExtraInfo
        );
    };

    const onProtectlandNameTextChange = (e: SearchSelectResult) => {
        // console.log("valueList--->", valueList);
        // const value = valueList[valueList.length - 1];
        // const value = valueList.toString();
        const { value, option } = e;
        if (value) {
          form.setFieldValue("protectlandName", value);
          handleSetFormData("protectlandName", value);
        } else {
          form.setFieldValue("protectlandName", "");
          handleSetFormData("protectlandName", "");
        }
      };

    const onProtectlandAreaTextChange = (e: ChangeEvent<HTMLInputElement>) => {
        handleSetFormData("protectlandArea", getChangeEventValue(e));
    };

    const onPickerProblems = (problemKeys: string) => {
        handleSetFormData("protectlandProblemList", problemKeys);
    };

    const onStartYearChange = (e: any) => {
        console.log("onStartYearChange--->", e);
        const startYear = formatYear(e);
        handleSetFormData("startYear", startYear);
        if (isEmpty(formData.endYear)) {
            handleSetFormData("endYearStep", "10");
            handleSetFormData("endYear", Number(startYear) + 9 + "");
            form.setFieldValue("endYearStep", "10");
        }
    };

    const onStartYearSelectChange = (e: string) => {
        const startYear = e;
        handleSetFormData("startYear", startYear);
        if (isEmpty(formData.endYear)) {
            handleSetFormData("endYearStep", "10");
            handleSetFormData("endYear", Number(startYear) + 9 + "");
            form.setFieldValue("endYearStep", "10");
        }
    }

    const onEndYearSelectChange = (e: string) => {
        if (isEmpty(formData.startYear)) {
            return toastShort("warning", "请先选择规划基准年份");
        }
        const endYear = (Number(formData.startYear) + (Number(e) - 1)).toString();
        handleSetFormData("endYear", endYear);
    };

    const adaptModalTitle = () => {
        return `创建副本-保护地基本信息`;
    };

    const onTopicTemplateChange = (e: string) => {
        handleSetFormData("topicTemplateId", e);
    };

    const onFillProjectDetails = (projectExtraInfo: ProtectlandExtraInfoType) => {
        let _formData = formData;
        _formData.protectlandExtraInfo = projectExtraInfo;
        setFormData({ ..._formData })
    }

    return (
        <Modal
            title={adaptModalTitle()}
            open={isModalOpen}
            onOk={handleConfirm}
            onCancel={handleCancel}
            okText={"确 认"}
            cancelText={!isEmpty(formData.id) ? "关闭" : "取 消"}
            width={800}
            maskClosable={false}
            confirmLoading={submitLoading}
            centered
        >
            <div className="custom-modal-container">
                <LoadingWapper loading={loading} />
                <Form
                    size={"middle"}
                    form={form}
                    layout={"horizontal"}
                    autoComplete="off"
                    labelAlign={"right"}
                    labelCol={{ span: 4 }}
                    style={{ width: "100%" }}
                >
                    <Form.Item label="类型" required>
                        <Space align={"baseline"}>
                            <Form.Item
                                name={"type"}
                                rules={[{ required: true, message: "请选择保护地一级分类" }]}
                            >
                                <Select
                                    placeholder="请选择保护地一级分类"
                                    style={{ width: "254px", marginRight: 17 }}
                                    options={protectlandTypeList}
                                    loading={getDataLoading}
                                    value={formData.type}
                                    onChange={onTypeChange}
                                    allowClear
                                />
                            </Form.Item>
                            <Form.Item
                                name={"subType"}
                                rules={[{ required: true, message: "请选择保护地二级分类" }]}
                            >
                                <Select
                                    placeholder="请选择保护地二级分类"
                                    style={{ width: "254px" }}
                                    options={currentProtectlandSubTypeList}
                                    loading={getDataLoading}
                                    value={formData.subType}
                                    onChange={onSubTypeChange}
                                    allowClear
                                />
                            </Form.Item>
                        </Space>
                    </Form.Item>
                    <Form.Item
                        label="省份"
                        name={"protectlandProvince"}
                        rules={[{ required: true, message: "请选择省份" }]}
                        style={{ marginTop: -22 }}
                    >
                        <Select
                            placeholder="请选择省份"
                            style={{ width: "536px" }}
                            options={provinceList}
                            onChange={onProvinceChange}
                            allowClear
                        />
                    </Form.Item>
                    <Form.Item
                        label="级别"
                        name={"protectlandLevel"}
                        rules={[{ required: true, message: "请选择保护地级别" }]}
                    >
                        <Select
                            placeholder="请选择保护地级别"
                            onChange={onProtectlandLevelChange}
                            style={{ width: "536px" }}
                            options={[
                                { value: "1", label: "国家级" },
                                { value: "2", label: "省（自治区、直辖市）级" },
                                { value: "3", label: "市（自治州）级" },
                                { value: "4", label: "县（自治县、旗、县级市）级" },
                            ]}
                            allowClear
                        />
                    </Form.Item>
                    <Form.Item
                        label="名称"
                        name={"protectlandName"}
                        rules={[{ required: true, message: "请输入保护地名称" }]}
                    >
                        {/* <Select
                            showSearch
                            placeholder="请输入完整名称将用于名称的自动填充"
                            style={{ width: "536px" }}
                            maxLength={30}
                            //@ts-ignore
                            value={formData.protectlandName}
                            options={currentTypeProtectLandList}
                            //@ts-ignore
                            onChange={onProtectlandNameTextChange}
                            mode="tags"
                            allowClear
                        /> */}
                        <SearchSelect
                            options={currentTypeProtectLandList}
                            style={{ width: "536px" }}
                            selectPopoverWidth={536}
                            value={formData.protectlandName}
                            onChange={onProtectlandNameTextChange}
                            placeholder="请输入完整名称将用于名称的自动填充"
                            maxLength={300}
                        />
                    </Form.Item>
                    <Form.Item
                        label="面积"
                        name={"protectlandArea"}
                        rules={[{ required: true, message: "请输入保护地面积" }]}
                    >
                        <Input
                            placeholder="请输入详细面积将用于后续相关信息的计算"
                            style={{ width: "536px" }}
                            addonAfter={areaUnitListSelect}
                            type={"number"}
                            value={formData.protectlandArea}
                            onChange={onProtectlandAreaTextChange}
                            maxLength={30}
                            allowClear
                        />
                    </Form.Item>
                    {/* {formData.endYear} */}
                    <Form.Item
                        label="规划年限"
                        name={'startYear'}
                        rules={[{ required: true, message: "请选择规划年限" }]}
                        extra={(
                            <div style={{ marginTop: -18, fontSize: 14 }}>
                                {
                                    !formData.id ?
                                        <>
                                            <ExclamationCircleOutlined style={{ color: '#C73333', marginBottom: 3 }} />&nbsp;
                                            填写保护区基本信息,有助于系统为您智能推荐规划内容, 建议
                                            <div className="link-text" onClick={handleOpenProtectlandDetaildModal}>「补充更多信息，让规划更科学!」</div>
                                        </>
                                        :
                                        <>
                                            <ExclamationCircleOutlined style={{ color: '#C73333', marginBottom: 3 }} />&nbsp;
                                            <div className="link-text" onClick={handleOpenProtectlandDetaildModal}>查看填写的保护区详细信息</div>
                                        </>
                                }
                            </div>
                        )}
                    >
                        <Space>
                            <Form.Item
                                label=""
                                name={"startYear"}
                                rules={[{ required: true, message: "请选择规划基准年份" }]}
                            >
                                <Select
                                    options={startYearOptions}
                                    style={{ width: "254px" }}
                                    value={
                                        isEmpty(formData.endYearStep)
                                            ? formData.endYearStep
                                            : undefined
                                    }
                                    placeholder={"请选择规划年限"}
                                    onChange={onStartYearSelectChange}
                                />
                            </Form.Item>
                            <Form.Item
                                label=""
                                name={"endYearStep"}
                                rules={[{ required: true, message: "请选择规划年限" }]}
                            >
                                <Select
                                    options={endYearOptions}
                                    style={{ width: "254px" }}
                                    value={
                                        isEmpty(formData.endYearStep)
                                            ? formData.endYearStep
                                            : undefined
                                    }
                                    placeholder={"请选择规划年限"}
                                    onChange={onEndYearSelectChange}
                                />
                            </Form.Item>
                        </Space>
                    </Form.Item>
                </Form>
            </div>
            <ProtectlandDetailsModal
                ref={protectlandDetailsModalRef}
                onFinish={onFillProjectDetails}
                isEdit={!isEmpty(formData.id)}
            />
        </Modal>
    );
};

export default forwardRef(CopyProjectModal);
